<div class="content">
    <div id="example_title">
        <h1>Resizable Popup</h1>
        Though you cannot open more then on popup, you can make popups resiable (bototm right corner). You can also open popups that
        does not block underlying page.
    </div>
    <div id="example_view"></div>
    <div id="example_code"></div>
</div>

<!--CODE-->
<button id="popup" class="w2ui-btn">Open Popup</button>
<div style="display: inline-block; margin-left: 20px; width: 200px">
    <label>
        <input id="lock" type="checkbox" style="position: relative; top: 1px;">
        Do not block page
    </label>
</div>

<!--CODE-->
<script type="module">
import { w2popup, query } from '__W2UI_PATH__'

query('#popup').on('click', popup)

function popup() {
    w2popup.open('Some text', {
        blockPage: !query('#lock').prop('checked'),
        resizable: true,
    })
}
</script>
